<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>calc</title>
	</head>
	<body>
		<p>数字1：</p>
		<input id="i1" type="text" />
		<p>数字2：</p>
		<input id="i2" type="text" />
		<!--shift+回车 快捷br-->
		<br />
		<br />
		<br />
		<br />
		<!--//按钮的点击事件，执行add方法-->
		<input id="btn" type="button" value="+" onclick="add()"/>
		<input id="btn2" type="button" value="-" onclick="sub()"/>
		<input id="btn3" type="button" value="*" onclick="mul()"/>
		<input id="btn4" type="button" value="/" onclick="div()"/>
		<p id="sum"></p>
		<p id="sub"></p>
		<p id="mul"></p>
		<p id="div"></p>
		<!--//写add方法-->
		<script>
			function add(){

				 var num1=document.getElementById('i1');
				 var num2=document.getElementById('i2');
				 var sum=document.getElementById('sum');

				 var result=num1.value+num2.value;

				 if(isNaN(num1.value)){
				 	alert("第一个数字输入有误，请重新输入");
				 }else if(isNaN(num2.value)){
				 	alert("第二个数字输入有误，请重新输入");
				 }else{
				 result=Number(num1.value)+Number(num2.value)
				 sum.innerHTML=(num1.value)+"+"+(num2.value)+"="+result;
				 
				 }
				 
				  
			}
			
			
			function sub(){

				 var num1=document.getElementById('i1');
				 var num2=document.getElementById('i2');
				 var minus1=document.getElementById('sub');
				 
				 var result=num1.value-num2.value;

				  if(isNaN(num1.value)){
				 	alert("第一个数字输入有误，请重新输入");
				 }else if(isNaN(num2.value)){
				 	alert("第二个数字输入有误，请重新输入");
				 }else{
				 result=Number(num1.value)-Number(num2.value)
				 sum.innerHTML=(num1.value)+"-"+(num2.value)+"="+result;
				 
				 }
			}			
			function mul(){
				var num1=document.getElementById('i1');
				var num2=document.getElementById('i2');
				var multiply1=document.getElementById('mul');
				
				var result=num1.value*num2.value;
				  if(isNaN(num1.value)){
				 	alert("第一个数字输入有误，请重新输入");
				 }else if(isNaN(num2.value)){
				 	alert("第二个数字输入有误，请重新输入");
				 }else{
				 result=Number(num1.value)*Number(num2.value)
				 sum.innerHTML=(num1.value)+"*"+(num2.value)+"="+result;
				 
				 }
				
			}
			function div(){
				var num1=document.getElementById('i1');
				var num2=document.getElementById('i2');
				var multiply1=document.getElementById('div');
				
				var result=num1.value/num2.value;
				  if(num1.value==0){
				 	alert("第一个数字输入有误，请重新输入");
				 }else if(isNaN(num2.value)){
				 	alert("第二个数字输入有误，请重新输入");
				 }else if(num2.value==0){
				 	alert("被除数不能为0");
				 }
				 else{
				 result=Number(num1.value)/Number(num2.value)
				 sum.innerHTML=(num1.value)+"/"+(num2.value)+"="+result;
				 
				 }
				
			}
			
		</script>
	</body>
</html>